import { Button, Typography } from 'antd';

import { localStg } from '@/utils/storage';

import type { FallbackProps } from 'react-error-boundary';

const isDev = import.meta.env.DEV;

const { Text, Title } = Typography;

const theme = localStg.get('themeColor') ?? '#646cff';

const ErrorPage = ({ error, resetErrorBoundary }: FallbackProps) => {
	// 可以在这里根据不同的业务逻辑处理错误或者上报给日志服务

	return (
		<div className="size-full min-h-520px flex-col-center gap-16px overflow-hidden">
			<div className="flex text-400px text-primary">
				<SvgIcon localIcon="error" />
			</div>
			{isDev ? <Text code>{error.message}</Text> : <Title level={3}>出错了，请稍后再试</Title>}
			<Button style={{ backgroundColor: theme }} type="primary" onClick={resetErrorBoundary}>
				刷新重试
			</Button>
		</div>
	);
};

export default ErrorPage;
